// @use '_variables.scss';

:root {
    --font-base: #{fluid-value(
      map-get($base-font-range, min), 
      map-get($base-font-range, max)
    )};
  }
  
  html {
    font-size: var(--font-base);
    
    @media (min-width: map-get($breakpoints, wide)) {
      font-size: map-get($base-font-range, max);
    }
  }
  
  // 类型系统生成器
  @mixin generate-typography($levels: 6) {
    @for $i from 1 through $levels {
      h#{$i}, .h#{$i} {
        font-size: rem(16px * type-scale(7 - $i));
        line-height: 1.2;
        margin-bottom: rem(8px);
        
        @media (min-width: map-get($breakpoints, tablet)) {
          font-size: fluid-value(
            16px * type-scale(7 - $i), 
            24px * type-scale(7 - $i)
          );
        }
      }
    }
  }
  
  @include generate-typography(6);